<template>
  <div id="research">
    <my-research  v-model="value" cancel-text="取消" placeholder="请输入因子名称">
      <div class="result-content">
        <p v-if="isResult">抱歉!没有搜到相关因子</p>
        <p v-if="!isResult">根据关键词,为你推荐如下因子</p>
        <ul class="result-list-item">
          <li>语文</li>
          <li>数学英语英语英语</li>
          <li>英语英语</li>
          <li>体育英语英语</li>
          <li>语文英语</li>
          <li>数学</li>
          <li>英语英语</li>
          <li>体育</li>
          <li>语文</li>
          <li>数学</li>
          <li>英语</li>
          <li>体育</li>
          <li>语文</li>
          <li>数学</li>
          <li>英语</li>
          <li>体育</li>
          <li>语文</li>
          <li>数学</li>
          <li>英语</li>
          <li>体育</li>
        </ul>
      </div>
    </my-research>
  </div>
</template>
<script>
export default {
  name: 'research',
  isResult: 'false',
  data () {
    return {
      value: '',
      result: [
        {
          'title': '语文',
          'value': '98'
        },
        {
          'title': '数学',
          'value': '98'
        },
        {
          'title': '体育',
          'value': '98'
        },
        {
          'title': '美术',
          'value': '98'
        }
      ]
    }
  }
}
</script>
<style scoped>
.result-content{
  margin-top: 8px;
  padding: 0 0.40625rem;
}
.result-content p{
  color: #999999;
  text-align: left;
  height: 1.3125rem;
  line-height: 1.3125rem;
}
.result-list-item{
  overflow: hidden;
}
.result-list-item li{
  text-align: left;
  float: left;
  font-size: 14px;
  color:#333;
  height: 0.6875rem;
  line-height: 0.6875rem;
  border:1px solid #ddd;
  border-radius: 2px;
  padding: 0 0.28125rem;
  margin:0 0.25rem 0.25rem 0;
  box-sizing: border-box;
}
</style>


